<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>错误提示</title>
</head>


<style>

    body{
        margin: 0;
        padding: 0;
        background: url(/img/loginLibrary.jpg);

        font-family: sans-serif;
        background-size: cover;

    }
    .button {
        display: inline-block;
        border-radius: 4px;
        background-color: #f4511e;
        border: none;
        color: #FFFFFF;
        text-align: center;
        font-size: 15px;
        padding: 6px;
        /*width: 100%;*/
        transition: all 0.5s;
        cursor: pointer;
        margin: 5px;

    }

    .button2{width: 35%;}
    .button3{width: 35%;
        position: relative;
        left:80px;
    }

    .button span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

    .button span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

    .button1 span:after {
        content: '»';
        position: absolute;
        opacity: 0;
        top: 0;
        right: -20px;
        transition: 0.5s;
    }
    .button3 span:after {
        content: '»';
        position: absolute;
        opacity: 0;
        top: 0;
        right: -20px;
        transition: 0.5s;
    }

    .button2 span:after {
        content: '«';
        position: absolute;
        opacity: 0;
        top: 0;
        left: -20px;
        transition: 0.5s;
    }

    .button1:hover span {
        padding-right: 10px;
    }
    .button2:hover span {
        padding-left: 10px;
    }
    .button3:hover span {
        padding-right: 10px;
    }

    .button1:hover span:after {
        opacity: 1;
        right: 0;
    }
    .button2:hover span:after {
        opacity: 1;
        left: 0;
    }
    .button3:hover span:after {
        opacity: 1;
        right: 0;
    }

    .box{

        position: absolute;
        top:50%;
        left: 50%;
        transform: translate(-50%,-50%);
        width: 400px;
        padding: 40px;
        background: rgba(0,0,0,.8);
        box-sizing: border-box;
        box-shadow: 0 15px 25px rgba(0,0,0,.5);
        border-radius: 10px;


    }

    .box h2{
        margin: 0 0 30px;
        padding: 0;
        color: #fff;
        text-align: center;
    }
    .box h3{
        margin: 0 0 20px;
        padding: 0;
        color: #fff;
        text-align: center;
    }
</style>

<body>

<div class="box">

               <h2>注册失败！</h2>
    <h3>用户已存在或邮箱未绑定</h3>
    <a  th:href="@{login}"><button class="button button2" type="button"><span>返回登录</span></button></a>
    <a th:href="@{registUser}"><button class="button button3" type="button"><span>继续注册</span></button></a>

</div>

</body>
</html>